<template>
    <div class="orderPage">
        <h2>商品及优惠券</h2>
        <ul class="list">
            <li v-for="(item,index) in list" :key="index">
                <img :src="'http://101.132.181.9:3000/' +item.productImg">
                <big>{{item.productName}}</big>
                <b>{{item.price}}元*{{item.num}}</b>
                <span>{{item.price}}元</span>
            </li>
        </ul>
    </div>
</template>


<script>
export default {
  data() {
    return {
      list: []
    };
  },
  computed: {
    sumNum() {
      let sum = 0;
      this.list.forEach(item => (sum += item.num));
      return sum;
    },
    allPrice() {
      let price = 0;
      this.list.forEach(item => (price += item.price));
      return price;
    }
  },
  created() {
    this.list = JSON.parse(this.$route.query.arr);
    console.log(this.list);
  }
};
</script>

<style lang="scss" scoped>
.list {
  li {
    border-bottom: 1px solid #000;
    display: flex;
    align-items: center;
    justify-content: space-around;
    span {
      color: orangered;
    }
  }
  .lis {
    height: 50px;
  }
}
h2{
    width: 1070px;
    margin-left: 200px;
}
</style>
